@charset "utf-8";
$color: #0078d7;
.container-fluid {
    .header {
        background-color: #222;
        nav {
            border: none;
            margin-bottom: 0;
        }
        .navbar-brand {
            padding: 7px 15px;
        }
    }
    .footer {
        background-color: #3b3b3b;
        padding: 35px 0 38px 0;
        position: relative;
        .footer_text {
            a {
                font-size: 14px;
                color: #a1a3ab;
                line-height: 28px;
            }
            .police {
                font-size: 12px;
                color: #a1a3ab;
                line-height: 27px;
            }
        }
        .footer_link {
            position: relative;
            .erweima {
                display: inline-block;
                padding: 10px;
                border: 1px solid #ddd;
                border-radius: 5px;
                background-color: #FFFFFF;
                position: absolute;
                top: -157px;
                right: 24px;
                display: none;
                &:after {
                    content: "";
                    display: block;
                    width: 0;
                    height: 0;
                    border-top: 10px solid #ffffff;
                    border-right: 9px solid transparent;
                    border-left: 9px solid transparent;
                    position: absolute;
                    top: 143px;
                    left: 68px;
                }
            }
            .mail {
                display: inline-block;
                padding: 10px;
                border: 1px solid #ddd;
                border-radius: 5px;
                background-color: #FFFFFF;
                position: absolute;
                top: -85px;
                right: 90px;
                display: none;
                &:after {
                    content: "";
                    display: block;
                    width: 0;
                    height: 0;
                    border-top: 10px solid #ffffff;
                    border-right: 9px solid transparent;
                    border-left: 9px solid transparent;
                    position: absolute;
                    top: 70px;
                    left: 68px;
                }
            }
            .qq {
                display: inline-block;
                padding: 10px;
                border: 1px solid #ddd;
                border-radius: 5px;
                background-color: #FFFFFF;
                position: absolute;
                top: -65px;
                right: -41px;
                display: none;
                &:after {
                    content: "";
                    display: block;
                    width: 0;
                    height: 0;
                    border-top: 10px solid #ffffff;
                    border-right: 9px solid transparent;
                    border-left: 9px solid transparent;
                    position: absolute;
                    top: 50px;
                    left: 68px;
                }
            }
            .mail_pic,
            .erweima_pic,
            .qq_pic {
                cursor: pointer;
            }
            .mail_pic:hover~.mail {
                display: block;
            }
            .erweima_pic:hover~.erweima {
                display: block;
            }
            .qq_pic:hover~.qq {
                display: block;
            }
        }
    }
}

@media screen and (min-width:768px) and (max-width:1199px) {
    .container-fluid {
        .header_content {
            a {
                padding: 15px 3%;
            }
        }
    }
}

@media screen and (min-width:319px) and (max-width:413px) {
    .container-fluid {
        .footer {
            .footer_text {
                a {
                    font-size: 12px;
                }
            }
            .police {
                font-size: 8px;
            }
        }
    }
}